<%--
  Created by IntelliJ IDEA.
  User: 20275
  Date: 2023/11/18
  Time: 16:16
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<%@include file="/pages/common/head.jsp"%>

<div id="page-wrapper">
    <div class="row">
        <div class="col-lg-12">
            <h1 class="page-header">调寝申请</h1>
        </div>
    </div>
    <div class="row">
        <div class="col-lg-12">
            <div class="panel panel-default">
                <div class="panel-heading">
                    调寝申请 >> 申请报告
                </div>
                <div class="panel-body">
<%--                    <div id="message_div" class="alert alert-danger"  role="alert" style="margin-top: 15px;display: none">两次密码不一致</div>--%>
                    <form role="form" action="${pageContext.request.contextPath }/transfer/addTransferInfo"
                          method="post" onsubmit="return validateForm()">
                        <%--   补充信息  --%>
                        <input value="${stu_info.studentId}" name="applyChamberStuId" type="hidden" >
                        <input value="${ChamberId}" name="applyChamberId" type="hidden" >
                        <input value="${ChamberFloorId}" name="applyChamberFloorId" type="hidden" >
                        <input value="${ChamberFloor}" name="applyChamberFloorNumber" type="hidden" >

                        <div class="row">
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <!-- 头像区域和上传按钮 -->
                                    <div class="avatar-wrapper">
                                        <img id="avatarImg" class="avatar" src="${pageContext.request.contextPath }/img/${stu_info.studentImgName}" alt="头像">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label>原寝室楼/楼层/寝室号</label>
                                    <input class="form-control"  value="${chamber_floor_number_builder}" readonly>
                                </div>
                                <div class="form-group">
                                    <label>学生姓名</label>
                                    <input class="form-control"  value="${stu_info.studentName}" readonly >
                                </div>
                                <div class="form-group">
                                    <label>联系电话</label>
                                    <input class="form-control"  name="applyChamberPhone" required>
                                </div>

                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label>寝室楼</label>
                                    <select class="form-control" id="chamberFloor_Name_select" name="applyChamberNewFloorId" required>
                                        <option value="0">--------</option>
                                        <c:forEach items="${chamberfloorinfos}" var="info">
                                            <option value="${info.chamberFloorId}">${info.chamberFloorName}</option>
                                        </c:forEach>
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label>楼层</label>
                                    <select class="form-control" id="chamberFloor_number_select" name="applyChamberNewFloorNumber" required>
                                        <option value="0">----请选择寝室楼！----</option>
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label>选择入住寝室</label>
                                    <select class="form-control" id="chamber_number_select" name="applyNewChamberId" required>
                                        <option value="0">----请选择楼层！----</option>
                                    </select>
                                </div>
                                <input type="submit" class="btn btn-primary" value="申请">
                                <input type="reset" class="btn btn-warning" value="重置">
                            </div>
                        </div>

                    </form>

                </div>
            </div>
        </div>
    </div>
</div>

<c:if test="${message != null}">
    <script>
        alert("${message}")
    </script>

    <% session.removeAttribute("message");%>
</c:if>
<script>
    var chamber_number = 0
    var chamber_floor_id = 0

    <%--  点击寝室楼后的改变事件  --%>
    $('#chamberFloor_Name_select').change(function() {
        var selectElement = document.getElementById('chamberFloor_number_select');
        chamber_floor_id = $(this).val();

        selectElement.innerHTML = '';

        var newOption = document.createElement('option');
        newOption.text = "----请选择楼层！----";
        selectElement.add(newOption);

        for (let i = 1; i <= 6; i++) {
            newOption = document.createElement('option');
            newOption.text = i+"层";
            newOption.value = i;
            selectElement.add(newOption);
        }
    });

    <%--  点击楼层后的改变事件  --%>
    $('#chamberFloor_number_select').change(function() {
        var selectElement = document.getElementById('chamber_number_select');
        chamber_number = $(this).val();
        $.ajax({
            type: 'get',
            url: '${pageContext.request.contextPath }/transfer/ByFloorNumberSelectChamber',
            data: { Chamber_floor_id: chamber_floor_id,Chamber_floor_number:chamber_number},
            success: function(response) {
                console.log(response)
                selectElement.innerHTML = '';

                var newOption = document.createElement('option');

                if (response.data.length > 0){
                    newOption.text = "----请选择寝室号！----";
                    newOption.value = 0;

                    selectElement.add(newOption);
                    for (let i = 0; i < response.data.length; i++) {
                        newOption = document.createElement('option');
                        newOption.text = response.data[i].chamberHotelNumber;
                        newOption.value = response.data[i].chamberId;
                        selectElement.add(newOption);
                    }
                }else{
                    newOption.text = "----无适合寝室，请重新选择！----";
                    newOption.value = 0;

                    selectElement.add(newOption);

                }
            },
            error: function(log) {
                // 在请求出错时的处理
                console.log('请求出错:'+log);
            }
        });
    });

    function validateForm(){
        if ($('#chamberFloor_Name_select').val() == 0 ||
            $('#chamberFloor_number_select').val() == 0 ||
            $('#chamber_number_select').val() == 0){
            alert("信息请填完整")
            return false
        }else
            return true

    }
</script>

<%@include file="/pages/common/foot.jsp" %>
